<template name="photoVideo">
	<view class="photoVideo">
		<view class="photoCon">
			<view class="photo_title">{{photoData.title}}</view>
			<view class="photo">
				<view class="photo_item" @click="photoShow(key,value.type)" v-for="(value, key, index) in photoData.content" v-if="value.isShow!==false">
					<image :src="value.url" v-show="!(!!value.fullUrl && value.type=='video')"></image>
					<view class="photo_item_confirm" v-show="value.status==-1">
						<view>审核失败</view><view>点击重新上传</view>
					</view>
					<video v-show="!!value.fullUrl && value.type=='video'" :src="value.fullUrl" controls object-fit="cover" :show-fullscreen-btn="false"></video>
					<view v-html="value.text"></view>
				</view>
			</view>
		</view>
		<u-action-sheet :list="sheet.list" v-model="sheet.show" @click="photoSel"></u-action-sheet>
		<u-action-sheet :list="videoSheet.list" v-model="videoSheet.show" @click="videoSel"></u-action-sheet>
	</view>
</template>

<script>
	import { uploadimg,uploadtempkeys,getPhotoInfo } from '../../api/index.js';
	export default {
		name: "photoVideo",
		data() {
			return {
				sheet:{
					list: [{
						text: '拍照'
					}, {
						text: '从相册中选择' 
					}],
					show: false
				},
				videoSheet:{
					list: [{
						text: '录像'
					}, {
						text: '从相册中选择' 
					}],
					show: false
				},
				currentPhoto:{ //当前选中的图片
					index:'',
					key:''
				},
			};
		},
		props:{
			photoData:""
		},
		methods:{
			//选择图片或视频
			photoShow:function(key,type){
				if(type == 'video'){
					this.videoSheet.show = true
				}else{
					this.sheet.show = true
					this.currentPhoto.key = key;
				}
			},
			//选择照片
			photoSel:function(index){
				console.log(index)
				let that = this;
				let sourceType = [];
				if(index==0){
					sourceType = 'camera';
				}else{
					sourceType = 'album';
				}
				cm.chooseImage({
					count:1,
					sourceType:sourceType,
					success:function(res){
						// console.log(res)
						let base64Obj = JSON.parse(res);
						let baseStr = '';
						if(index == 0){
							baseStr = base64Obj.base64String;
						}else{
							baseStr = base64Obj.base64StringArray[0];
						}
						that.updateImgfun(baseStr);
						that.imageKnow(that.currentPhoto.key,baseStr) //图片自动识别
					},
					fail:function(){
						uni.showToast({
							icon:'none',
							title:'获取图片失败'
						})
					}
				});
			},
			//选择视频
			videoSel:function(index){
				let that = this;
				let sourceType = '';
				if(index==0){
					sourceType = 'camera';
				}else{
					sourceType = 'album';
				}
				console.log(sourceType)
				uploadtempkeys().then((res)=>{
					if(res.code == 0){
						cm.videoFunction({
						    videoMaxDuration: 20, //视频长度
						    sourceType: sourceType, //['album', 'camera']
						    tempSignatureData: res.data, //key 通过接口获取
							success:function(res){
								res = JSON.parse(res)
								if(res.code == 0){
									let imgUrl = '';
									that.photoData.content['storeVideo'].fullUrl = res.data.fullVideoUrl;
									that.photoData.content['storeVideo'].status = 1;
								}else{
									uni.showToast({
										icon:'none',
										title:res.message
									})
								}
							},
							fail:function(){
								console.log(res)
							}
						})
					}else{
						uni.showToast({
							icon:'none',
							title:res.msg
						})
					}
					
				}).catch((e) => {
					console.log(e)
				});
			},
			//修改图片逻辑
			async updateImgfun(base64){
				let that = this;
				// console.log(base64)
				let uploadimgData = await uploadimg({
					img:base64,
					key:'assistauth',
					uid: this.$store.state.merchantver.uid
				}); //base64转图片
				// console.log(uploadimgData)
				if(uploadimgData.code == 0){
					this.photoData.content[this.currentPhoto.key].url = uploadimgData.data.url;
					this.photoData.content[this.currentPhoto.key].fullUrl = uploadimgData.data.url;
					this.photoData.content[this.currentPhoto.key].status = 1;
				}else{
					uni.showToast({
						icon:'none',
						title:uploadimgData.res
					})
				}
			},
			//图片自动识别
			imageKnow:function(key,image){
				let type = '';
				if(key == 'idCardFront'){
					type = 1;
				}else if(key == 'openingPermit'){
					type = 2;
				}else if(key == 'businessLicense'){
					type = 3;
				}else{
					return ;
				}
				let obj = {
					type:type,
					image:image
				}
				console.log(type)
				getPhotoInfo(obj).then((res) => {
					console.log(res);
					if(res.code == 0){
						this.$emit('pvimgKnow',res.data,type);
					}else{
						uni.showToast({
							icon:'none',
							title:'图片自动识别失败，请手动输入信息'
						})
					}
				}).catch((res) => {
					console.log(res)
					uni.showToast({
						icon:'none',
						title:'图片自动识别失败，请手动输入信息'
					})
				})
			}
		},
		components: {
			
		}
	}
</script>

<style lang="scss" scoped>
	.photoCon{
		padding: 30rpx 30rpx 0rpx 30rpx;
		.photo_title{
			position: relative;
			font-weight: bold;
			padding-left: 20rpx;
			&::before{
				content: '';
				position: absolute;
				width: 6rpx;
				height: 30rpx;
				border-radius: 10rpx;
				background-color: #2079FF;
				left: 0;
				top: 4rpx;
			}
		}
		
		.photo{
			display: flex;
			display: -webkit-flex;
			justify-content: space-between;
			flex-direction: row;
			flex-wrap: wrap;
			padding-top: 40rpx;
			.photo_item{
				text-align: center;
				color: #999999;
				width: 48%;
				box-shadow: 0px 0px 30rpx rgba(0, 0, 0, 0.03);
				margin-bottom: 30rpx;
				padding-bottom: 20rpx;
				font-size: $uni-font-size-sm;
				position: relative;
				.photo_item_confirm{
					font-size: $uni-font-size-base;
					color: #F94441;
					position: absolute;
					left: 16rpx;
					right: 0;
					top: 0;
					width: 300rpx;
					height: 200rpx;
					background-color:rgba(0,0,0,0.3);
					display: flex;
					align-items: center;
					justify-content: center;
					flex-direction: column;
					z-index: 9;
				}
				image{
					width: 300rpx;
					height: 200rpx;
				}
				video{
					width: 300rpx;
					height: 200rpx;
				}
			}
		}
	}
</style>
